﻿@using _2009035.Utilities;
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>HR - System</title>
    <meta name="description" content="_layout page of the HR Application">
    <meta name="author" content="Sabry Moulana">

    <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->



    <!-- Styles -->
    <link type="text/css" href="~/Content/jquery-ui-1.8.16.custom.css" rel="stylesheet" />
    <link type="text/css" href="~/Content/bootstrap.css" rel="stylesheet">
    <link type="text/css" href="~/Content/demo.css" rel="stylesheet">
    <link type="text/css" href="~/Content/jquery.wijmo-open.1.5.0.css" rel="stylesheet">
    <link type="text/css" href="~/Content/kendo.common.min.css" rel="stylesheet" />
    <link type="text/css" href="~/Content/kendo.metro.min.css" rel="stylesheet" />
    <link type="text/css" href="~/Content/kendo.dataviz.min.css" rel="stylesheet" />
    <link type="text/css" href="~/Content/jquery.Jcrop.css" rel="stylesheet" />
    <link type="text/css" href="~/Uploadify/uploadify.css" rel="stylesheet" />
    <style type="text/css">
        /*#dvImageResize img {
            max-width: 100%;
            max-height: 100%;
        }*/
        .wijmo-container {
            display: block;
            clear: both;
            /*width: 820px;*/
        }
     
        /* Override some defaults */
        html, body {
            background-color: #eee;
        }

        body {
            padding-top: 40px; /* 40px to make the container go all the way to the bottom of the topbar */
        }

        .container > footer p {
            text-align: center; /* center align it with the container */
        }

        .container {
            width: 820px; /* downsize our container to make the content feel a bit tighter and more cohesive. NOTE: this removes two full columns from the grid, meaning you only go to 14 columns and not 16. */
        }

            /* The white background content wrapper */
            .container > .content {
                background-color: #fff;
                padding: 20px;
                margin: 0 -210px; /* negative indent the amount of the padding to maintain the grid system */
                -webkit-border-radius: 0 0 6px 6px;
                -moz-border-radius: 0 0 6px 6px;
                border-radius: 0 0 6px 6px;
                -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
                -moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);
                box-shadow: 0 1px 2px rgba(0,0,0,.15);
            }

        /* Page header tweaks */
        .page-header {
            background-color: #f5f5f5;
            padding: 20px 20px 10px;
            margin: -20px -20px 20px;
        }

        /* Styles you shouldn't keep as they are for displaying this base example only */
        .content .span10,
        .content .span4 {
            min-height: 500px;
        }
        /* Give a quick and non-cross-browser friendly divider */
        .content .span4 {
            margin-left: 0;
            padding-left: 19px;
            border-left: 1px solid #eee;
        }

        .topbar .btn {
            border: 0;
        }

        .ui-autocomplete {
            max-height: 100px;
            overflow-y: auto;
            /* prevent horizontal scrollbar */
            overflow-x: hidden;
            /* add padding to account for vertical scrollbar */
            padding-right: 20px;
        }
        /* IE 6 doesn't support max-height
             * we use height instead, but this forces the menu to always be this tall
             */
        * html .ui-autocomplete {
            height: 100px;
        }

        /*.ui-dialog .ui-widget .ui-widget-content .ui-corner-all .ui-draggable .ui-resizable {
            top:110px;
        }*/
    </style>

    <!--scripts-->

    <script type="text/javascript" src="~/Scripts/jquery-1.7.1.js"></script>
    <script type="text/javascript" src="~/Scripts/jquery-ui-1.8.16.custom.min.js"></script>
    <script type="text/javascript" src="~/Scripts/jquery.validate.js"></script>

    <!--daterangepicker-->
    <!--  <script type="text/javascript" src="Scripts/date.js"></script>
        <script type="text/javascript" src="Scripts/daterangepicker.jQuery.js"></script> -->

    <!--wijmo-->
    <script src="~/Scripts/jquery.mousewheel.min.js" type="text/javascript"></script>
    <script src="~/Scripts/jquery.bgiframe-2.1.3-pre.js" type="text/javascript"></script>
    <script src="~/Scripts/jquery.wijmo-open.1.5.0.min.js" type="text/javascript"></script>


    <!-- FileInput -->
    <script src="~/Scripts/enhance.min.js" type="text/javascript"></script>
    <script src="~/Scripts/fileinput.jquery.js" type="text/javascript"></script>

    <!--Form to js	-->
    <script type="text/javascript" src="~/Scripts/form2js.js"></script>

    <!--init for this page-->
    <script type="text/javascript" src="~/Scripts/demo.js"></script>

    <!--Kendo Grid	-->
    <script type="text/javascript" src="~/Scripts/kendo.all.min.js"></script>

     <!--JQ Chart -->
    <script type="text/javascript" src="~/Scripts/jquery.jqChart.min.js"></script>
    <script type="text/javascript" src="~/Scripts/jquery.jqRangeSlider.min.js"></script>

    <!--JCrop -->
    <script type="text/javascript" src="~/Scripts/jquery.Jcrop.min.js"></script>

     <!--Uploadify -->
    <script type="text/javascript" src="~/Uploadify/swfobject.js"></script>
    <script type="text/javascript" src="~/Uploadify/jquery.uploadify.v2.1.4.js"></script>
   
     <script>
         // declaring global JS variables for use in the script files
         var uploadifyUploader = '@Url.Content("/Uploadify/uploadify.swf")';
         var uploadifyCancelImg = '@Url.Content("/Uploadify/cancel.png")';
         var uploadifyScript = '@Url.Action("FileUpload", "Image")';
         var imageRepository = '@Url.Action("Show", "Image")/';
    </script>
    
      <!--Implemented JS application logic -->
    <script type="text/javascript" src="~/Scripts/coursework.logic.js"></script>
   
</head>

<body>


    <!--[if IE]>
  <link rel="stylesheet" type="text/css" href="css/custom-theme/jquery.ui.1.8.16.ie.css"/>
  <![endif]-->
    <div class="topbar">
        <div class="fill">

            <div class="content">
                   <div class="wijmo-container" >
                <ul id="menu1">
                    <li>
                       
                        <a href="#">HR System</a>
                       
                       @* <canvas id="canvas" height="50" width="100">
                            Your browser does not support the canvas element .
                        </canvas>*@
                    </li>
                    @if (User.Identity.IsAuthenticated == true)
                    {
                        <li><a href="#">Employee Control</a>
                            <ul>
                                <li>
                                    <a href="/Employee/Personal">My Profile</a>
                                </li>
                                @if ((User.IsInRole(UserRoles.HRManager.ToString())) || (User.IsInRole(UserRoles.HRExecutive.ToString())))
                                {
                                    <li>
                                        <a href="/Employee/Manage">Manage</a>
                                    </li>
                                }
                                else
                                {
                                    <li>
                                        <a href="/Employee/Search">Search</a>
                                    </li>   
                                }
                            </ul>

                        </li>
                        <li><a href="#">Departments</a>
                            <ul>
                            @{var departments = Enum.GetValues(typeof(Departments)).Cast<Departments>();
                              foreach (var singleDepartment in departments)
                              {
                                  if (singleDepartment != Departments.All)
                                  {
                                      string deptName = Utility.GetEnumDescription(singleDepartment);
                                      string deptUrl = string.Format("/Department/DepartmentInformation?departmentName={0}", singleDepartment);
                                <li>
                                    <a href=@deptUrl>@deptName</a>
                                </li>  
                                          }

                                      }
                    
                            }
                                </ul>

                        </li>

                    }
                  
                </ul>
               
            </div>
            </div>
         
        </div>
    </div>


    <div class="container">

        <div class="content">


            <div class="page-header">
                @* <h1>jQuery UI Bootstrap <small>A Bootstrap-themed kickstart for jQuery UI widgets (v0.14)</small>
                </h1>*@
            </div>
            <div class="row">

                @RenderBody()

            </div>
        </div>

        <footer>
            <p>
                HR System &copy; Sabry Moulana 2012. 
            </p>
        </footer>

    </div>

</body>
</html>
